<template>
	<view class="contener">
		<view class="biaodanBox">
			<image :src="imgapi" class="imgapi"></image>
			<view class="contener700" style="padding-top: 10rpx;">
				<!-- 	<view class="titleBox">
					现在入驻
				</view> -->
				<uni-forms v-model="formData" ref="form" :rules="rules">
					</uni-forms-item>
					<uni-forms-item label="您的姓名" required name="name">
						<uni-easyinput :disabled="disabled" type="text" v-model="formData.name" placeholder="请输入姓名"
							placeholderStyle="color: #f4f4f4" />
					</uni-forms-item>
					<uni-forms-item label="手机号" required name="phone">
						<uni-easyinput :disabled="disabled" type="text" v-model="formData.phone" placeholder="请输入手机号"
							placeholderStyle="color: #f4f4f4" />
					</uni-forms-item>
					<u-subsection :list="selectList" :current="current" @change="sectionChange" activeColor="#58751f"
						inactiveColor="#484848cc"></u-subsection>
					<view v-show="current==0">
						<uni-forms-item label="土地地区" required name="address">
							<view class="martop">
								<pickers @address="address" @close="close" :defaultAddress="defaultAddress">
									<view style="color: #fff;">{{formData.address||'点击我选择地址'}}</view>
								</pickers>
							</view>
						</uni-forms-item>
						<uni-forms-item label="详细地址" required name="dingwei">
							<view @click="dinwei">
								<uni-easyinput type="text" suffixIcon="location" v-model="formData.dingwei"
									placeholder="点击此处定位以获得土地详细地址" placeholderStyle="color: #f4f4f4"
									:styles="{color:'#fff'}" />
							</view>
						</uni-forms-item>
						<uni-forms-item label="种植类型" required name="plantType">
							<view class="martop">
								<radio-group @change="plantType" v-model="formData.zztype">
									<label>
										<radio :value="0" /><text>可摘菜</text>
									</label>
									<label style="margin: 0 15rpx;">
										<radio :value="1" /><text>可种菜</text>
									</label>
									<label>
										<radio :value="2" /><text>全支持</text>
									</label>
								</radio-group>
							</view>
						</uni-forms-item>
						<uni-forms-item required label="是否有合伙人">
							<view class="martop">
								<radio-group @change="partnerChange">
									<label style="margin-right:15rpx;">
										<radio :value="1" /><text>是</text>
									</label>
									<label>
										<radio :value="0" /><text>否</text>
									</label>
								</radio-group>
							</view>
						</uni-forms-item>

						<!-- 合伙人1-->
						<view v-show="partnerShow">
							<view style="text-align: center;margin: 10rpx 0">合伙人信息</view>
							<view class="tips">
								提示: 权益占比1:100(例如输入1则收益占比为100%)
							</view>
							<uni-forms-item label="合伙人手机号" :name="`${partnerPhonerule}`">
								<uni-easyinput type="number" placeholder="输入手机号点右边图标查询信息"
									v-model="formData.partnerPhone" @iconClick="searchPhone" suffixIcon="search"
									:styles="{color:'#fff'}" placeholderStyle="color: #f4f4f4" />
							</uni-forms-item>
							<view v-show="partnerInformationShow">
								<uni-forms-item label="合伙人姓名">
									<uni-easyinput type="text" disabled v-model="formData.partnerName" />
								</uni-forms-item>

								<uni-forms-item label="微信昵称">
									<uni-easyinput type="text" disabled v-model="formData.partnerwechat" />
								</uni-forms-item>
							</view>
							<uni-forms-item label="合伙人收益占比" :name="`${partnerSharesrule}`">
								<uni-easyinput type="digit" v-model="formData.partnerShares" @blur="partnerShares"
									placeholder="请输入合伙人收益占比" placeholderStyle="color: #f4f4f4" :styles="{color:'#fff'}"
									@input="checkShare()" />
							</uni-forms-item>



							<!-- 合伙人2 -->
							<uni-forms-item label="是否有合伙人2">
								<view class="martop">
									<radio-group @change="partnerChange2">
										<label style="margin-right:15rpx;">
											<radio :value="1" /><text>是</text>
										</label>
										<label>
											<radio :value="0" /><text>否</text>
										</label>
									</radio-group>
								</view>
							</uni-forms-item>
							<view v-show="partnerShow2">
								<view style="text-align: center;margin: 10rpx 0">合伙人信息2</view>

								<uni-forms-item label="合伙人手机号" :name="`${partnerPhonerule2}`">
									<uni-easyinput type="number" placeholder="输入手机号点右边图标查询信息"
										v-model="formData.partnerPhone2" @iconClick="searchPhone2" suffixIcon="search"
										placeholderStyle="color: #f4f4f4" :styles="{color:'#fff'}" />
								</uni-forms-item>

								<view v-show="partnerInformationShow2">
									<uni-forms-item label="合伙人姓名">
										<uni-easyinput type="text" disabled v-model="formData.partnerName2" />
									</uni-forms-item>
									<uni-forms-item label="微信昵称">
										<uni-easyinput type="text" disabled v-model="formData.partnerwechat2" />
									</uni-forms-item>
								</view>
								<uni-forms-item label="合伙人收益占比" :name="`${partnerSharesrule2}`">
									<uni-easyinput type="digit" v-model="formData.partnerShares2" @blur="partnerShares2"
										placeholder="请输入合伙人收益占比" placeholderStyle="color: #f4f4f4"
										:styles="{color:'#fff'}" @input="checkShare()" />
								</uni-forms-item>
							</view>
						</view>
					</view>
					<view v-show="current==1" style="margin-top: 30rpx;">
						<uni-forms-item label="店铺头像" label-align="center" label-width="300rpx">
							<u-upload :fileList="avatarList" @afterRead="afterRead" @delete="deletePic" name="1"
								:maxCount="1"></u-upload>
						</uni-forms-item>
						<uni-forms-item label="店铺名称">
							<uni-easyinput type="text" v-model="formData.storeName" placeholder="不填则系统默认名称"
								placeholderStyle="color: #f4f4f4" :styles="{color:'#fff',borderColor: '#ffffff'}" />
						</uni-forms-item>
					</view>
					<view class="desc">
						提交入驻申请代表您已同意
						<text style="font-size: 25rpx;color: #0043ffa3;font-weight: 400;"
							@click="goPage">《小小田野平台服务协议》</text>
					</view>
					<button class="btnsubmitForm" @tap="submitForm" type="primary">提交申请</button>
				</uni-forms>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		pathToBase64
	} from "@/js_sdk/mmmm-image-tools/index";
	import pickers from "../../components/ming-picker/ming-picker.vue"
	export default {
		components: {
			pickers
		},
		data() {
			return {
				avatarList: [{
					"url": "https://www.tdtye.com/files/vegetable_mall_file/default/storeAvatar.png"
				}],
				current: 0,
				disabled: false,
				selectList: ['我有土地', '我没有土地'],
				formData: {

					name: '',
					phone: '',
					address: '', //选中后的显示值
					dingwei: '',
					zztype: ',', //种植类型
					partnerPhone: '', //合伙人1
					partnerShares: '',
					partnerwechat: '',
					partnerName: '',
					partnerPhone2: '', //合伙人2
					partnerShares2: '',
					partnerwechat2: '',
					partnerName2: '',
				},
				//默认选中
				defaultAddress: ["广东省", "中山市", "石岐区"],
				sanjiaddress: '', //三级联动
				imgapi: '',
				searchPhoneObj: '',
				searchPhoneObj2: '',
				latitude: '',
				longitude: '',
				partnerShow: '',
				partnerShow2: '',
				partnerInformationShow: false,
				partnerInformationShow2: false,
				partnerInfo: [],
				partnerPhonerule: 'partnerPhone',
				partnerSharesrule: 'partnerShares',
				partnerPhonerule2: 'partnerPhone2',
				partnerSharesrule2: 'partnerShares2',
				//校验
				rules: {
					// 对name字段进行必填验证
					name: {
						rules: [{
							required: true,
							errorMessage: ' ',
						}, ]
					},
					phone: {
						rules: [{
								required: true,
								errorMessage: ' ',
							},
							{
								minLength: 11,
								maxLength: 11,
								errorMessage: '请输入11位手机号'
							}
						]
					},
					address: {
						rules: [{
							required: true,
							errorMessage: '请点击选择地址 ',
						}, ]
					},
					dingwei: {
						rules: [{
							required: true,
							errorMessage: ' ',
						}, ]
					},
					// 合伙人手机号1
					partnerPhone: {
						rules: [{
							required: true,
							errorMessage: '请输入手机号',
						}, {
							format: 'number',
							errorMessage: '手机号只能输入数字'
						}]
					},
					partnerwechat: {
						rules: [{
							required: true,
							errorMessage: ' ',
						}, ]
					},
					partnerShares: {
						rules: [{
							required: true,
							errorMessage: ' ',
						}]
					},
					partnerName: {
						rules: [{
							required: true,
							errorMessage: ' ',
						}, ]
					},
					partnerPhone2: {
						rules: [{
							required: true,
							errorMessage: ' ',
						}, ]
					},
					partnerwechat2: {
						rules: [{
							required: true,
							errorMessage: ' ',
						}, ]
					},
					partnerShares2: {
						rules: [{
							required: true,
							errorMessage: ' ',
						}, ]
					},
					partnerName2: {
						rules: [{
							required: true,
							errorMessage: ' ',
						}, ]
					},
				}
			}
		},
		onReady() {
			// 需要在onReady中设置规则
			this.$refs.form.setRules(this.rules)

			this.imgapi = this.$reqConfig.URLIMAGE + 'files/vegetable_mall_file/default/joinBanner.jpg'
			console.log('this.imgapi', this.imgapi)

		},
		onLoad() {
			this.getinfo()
		},
		methods: {
			afterRead(e) {
				console.log("e: ", e);
				this.avatarList.push({
					url: e.file.url
				})
				pathToBase64(e.file.url).then(res => {
					this.formData.storeAvatar = res
				});
			},
			deletePic(event) {
				this.avatarList.splice(event.index, 1)
				this.formData.storeAvatar = ""
			},
			sectionChange(index) {
				this.current = index
			},
			checkShare() {
				if (!this.$comm.checkNull(this.formData.partnerShares2)) {
					this.formData.partnerShares2 = 0;
				}
				if (!this.$comm.checkNull(this.formData.partnerShares)) {
					this.formData.partnerShares = 0;
				}
				let max = parseFloat(this.formData.partnerShares) + parseFloat(this.formData.partnerShares2)
				if (max >= 1) {
					uni.showToast({
						icon: "none",
						title: "合伙人收益占比不能大于1（100%）"
					})
				}
			},
			goPage() {
				uni.navigateTo({
					url: "../../pageA/mine/agreement"
				})
			},

			//请求提交
			getform(type) {
				if (type == 1) {
					if (!this.$comm.checkNull(this.formData.zztype) || this.formData.zztype == ",") {
						uni.showToast({
							icon: "none",
							title: "请选择种植类型"
						})
						return;
					}
					if (this.$comm.checkNull(this.formData.partnerPhone2, this.formData.partnerPhone)) {
						if (this.formData.partnerPhone2 == this.formData.partnerPhone) {
							uni.showToast({
								icon: "none",
								title: "两个合伙人不能是同一人"
							})
							return;
						}
					}
					this.partnerInfo = JSON.stringify(this.partnerInfo)
					this.$axios({
						url: "/user/info/joinApply",
						method: "post",
						data: {
							name: this.formData.name,
							phone: this.formData.phone,
							address: this.formData.dingwei,
							area: this.sanjiaddress[2],
							city: this.sanjiaddress[1],
							province: this.sanjiaddress[0],
							businessType: this.formData.zztype,
							hasPartner: this.partnerShow, //合伙人1
							lat: this.latitude,
							lng: this.longitude,
							partnerInfo: this.partnerInfo
						}
					}).then((res) => {
						this.partnerInfo = JSON.parse(this.partnerInfo)
						console.log('请求', res)
						if (res.message == "error") {
							uni.showToast({
								title: res.result,
								icon: 'none',
								duration: 2000
							});
						} else {
							uni.showToast({
								title: '提交成功',
								duration: 2000
							});
							this.dingYue()
						}
						uni.navigateBack(1)
					})
				} else {
					//没有土地
					this.$axios({
						url: "/user/info/joinApply",
						method: "post",
						data: {
							name: this.formData.name,
							phone: this.formData.phone,
							businessType: 3,
							storeName: this.formData.storeName,
							storeAvatar: this.formData.storeAvatar
						}
					}).then((res) => {
						if (res.message == "error") {
							uni.showToast({
								title: res.result,
								icon: 'none',
								duration: 2000
							});
						} else {
							uni.showToast({
								title: '提交成功',
								duration: 2000
							});
							this.dingYue()
						}
						uni.navigateBack(1)
					})
				}

			},
			//回显申请人名字和电话
			getinfo() {
				this.$axios({
					url: "user/info/info",
					method: "post",
					data: {}
				}).then((res) => {
					console.log('res', res)
					this.formData.name = res.result.name
					this.formData.phone = res.result.phone
					this.disabled = true
				})
			},
			dingYue() {
				//获取订阅消息权限
				uni.requestSubscribeMessage({
					//此处填写刚才申请模板的模板ID
					tmplIds: ['t7gVLYJuinXVd5oQ7YqetOE230bIa6ZrsQwIJK1oCwk'],
					success(res) {
						console.log('res', res)
						uni.showToast({
							title: '申请已提交，请等待管理员审核',
							icon: 'none',
							duration: 2000
						});
						setTimeout(() => {
							uni.switchTab({
								url: './mineInfo'
							});
						}, 2000)
					}
				})
			},
			//提交数据
			submitForm() {
				if (this.current == 0) {
					this.$refs.form.validate().then(res => {
						//判断是否有lat值
						if (this.latitude) {
							//判断是否有合伙人1
							if (this.partnerShow == 1) {
								//有合伙人1时判断查询是否回显合伙人名称
								if (this.formData.partnerwechat) {
									//回显成功后把合伙人收益占比加入到partnerInfo对象里
									if (this.formData.partnerShares) {
										this.searchPhoneObj.shares = this.formData.partnerShares
										this.partnerInfo.push(this.searchPhoneObj)
									}
									//判断是否有合伙人2
									if (this.partnerShow2 == 1) {
										if (this.formData.partnerwechat2) {
											//回显成功后把合伙人2收益占比加入到partnerInfo对象里
											if (this.formData.partnerShares2) {
												this.searchPhoneObj2.shares2 = this.formData.partnerShares2
												this.partnerInfo.push(this.searchPhoneObj2)
											}
											this.getform(1)
										} else {
											uni.showToast({
												title: '请点击查询图标核对合伙人信息，如查询不到请关闭合伙人',
												icon: 'none',
												duration: 2000
											});
										}
									} else {
										this.getform(1)
									}
								} else {
									uni.showToast({
										title: '请点击查询图标核对合伙人信息，如查询不到请关闭合伙人',
										icon: 'none',
										duration: 2000
									});
								}
							} else {
								this.getform(1)
							}
						} else {
							uni.showToast({
								title: '请选择定位详细地址',
								icon: 'none',
								duration: 2000
							});
						}
					}).catch(err => {
						if (err) {
							uni.showToast({
								title: '请完善表单',
								icon: 'none',
								duration: 2000
							});
						}
					})
				} else {
					this.getform(2)
				}

			},

			//种植类型
			plantType(e) {

				this.formData.zztype = e.detail.value
				console.log('种植类型', this.formData.zztype)
			},
			//合伙人开启与隐藏
			partnerChange(e) {
				console.log('合伙人', e.detail.value)
				if (e.detail.value == 1) {
					//开启
					this.partnerShow = 1
					this.partnerPhonerule = 'partnerPhone'
					this.partnerSharesrule = 'partnerShares'

				} else {
					//隐藏
					this.partnerShow = 0
					this.partnerPhonerule = ' '
					this.partnerSharesrule = ' '
					this.partnerPhonerule2 = ' '
					this.partnerSharesrule2 = ' '
					// this.partnerInfo=[]
				}
			},
			// 判断收益占比
			judgeEarn(e) {
				console.log("合伙人输入:", e)
				let flg = null
				flg = isNaN(e)
				if (flg) {
					uni.showToast({
						title: "请输入数字",
						icon: 'none',
						duration: 2000
					});
					return false
				}
				flg = e.replace(/^(\-)*(\d+)\.(\d\d).*$/, '$1$2.$3')
				if (e >= 1) {
					uni.showToast({
						title: "合伙人占比不能大于1",
						icon: 'none',
						duration: 2000
					});
					return false
				}
				return flg
			},
			//失去焦点
			partnerShares(e) {
				let flg = this.judgeEarn(e.detail.value)
				if (flg) {
					this.formData.partnerShares = flg
				}

			},
			//合伙2失去焦点
			partnerShares2(e) {
				let flg = this.judgeEarn(e.detail.value)
				if (flg) {
					this.formData.partnerShares2 = flg
				}
			},
			//合伙人2开启与隐藏
			partnerChange2(e) {
				console.log('合伙人2', e.detail.value)
				if (e.detail.value == 1) {
					this.partnerShow2 = 1
					this.partnerPhonerule2 = 'partnerPhone2'
					this.partnerSharesrule2 = 'partnerShares2'
				} else {
					this.partnerShow2 = 0
					this.partnerPhonerule2 = ' '
					this.partnerSharesrule2 = ' '

				}
			},
			//三级联动定位
			address(e) {
				console.log('三级联动定位', e.value[0])
				this.sanjiaddress = e.value
				this.formData.address = e.value.join("-");
			},
			//查询手机
			searchPhone() {
				if (this.formData.partnerPhone == "") {
					uni.showToast({
						title: "手机号不能为空",
						icon: 'none',
						duration: 3000
					});
					return
				}
				uni.showLoading({
					title: "加载中"
				})
				//请求
				this.$axios({
					url: "/user/info/phoneSelect",
					method: "post",
					data: {
						phone: this.formData.partnerPhone
					}
				}).then((res) => {
					let paramsJson = JSON.stringify(res.result);
					paramsJson = paramsJson.replace(/id/, 'usId');
					this.searchPhoneObj = JSON.parse(paramsJson);
					// this.partnerInfo.push(res.result)
					if (res.message == "success") {
						this.partnerInformationShow = true
						this.formData.partnerName = res.result.name
						this.formData.partnerwechat = res.result.nick
						uni.hideLoading()
					} else {
						uni.showToast({
							title: res.result,
							icon: 'none',
							duration: 3000
						});
					}
				})
			},
			//查询手机2
			searchPhone2() {
				if (this.formData.partnerPhone2 == "") {
					uni.showToast({
						title: "手机号不能为空",
						icon: 'none',
						duration: 3000
					});
					return
				}
				uni.showLoading({
					title: "加载中"
				})
				//请求
				this.$axios({
					url: "/user/info/phoneSelect",
					method: "post",
					data: {
						phone: this.formData.partnerPhone2
					}
				}).then((res) => {
					let paramsJson = JSON.stringify(res.result);
					paramsJson = paramsJson.replace(/id/, 'usId');
					this.searchPhoneObj2 = JSON.parse(paramsJson);
					if (res.message == "success") {
						this.partnerInformationShow2 = true
						this.formData.partnerName2 = res.result.name
						this.formData.partnerwechat2 = res.result.nick
						uni.hideLoading()
					} else {
						uni.showToast({
							title: res.result,
							icon: 'none',
							duration: 3000
						});
					}
				})
			},
			close() {},
			//获取详细定位
			dinwei() {
				let _this = this
				wx.chooseLocation({
					success: (res) => {
						if (res.address == "") {
							uni.showToast({
								icon: "none",
								title: "获取土地定位失败，请确认是否有勾选地址"
							})
						} else {
							let city = res.address
							let that = _this
							that.latitude = res.latitude
							that.longitude = res.longitude
							that.formData.dingwei = res.address
						}
					},
					fail: () => {
						wx.showToast({
							title: '取消定位',
							icon: 'none',
							duration: 1000
						})
					},
				})
			},

		}
	}
</script>

<style scoped lang="scss">
	page {
		background-color: #fff;

	}

	.tips {
		font-size: 28rpx;
		color: #FFEB3B;
		margin-bottom: 10rpx;
	}

	.color {
		color: #fff;
	}

	.titleBox {
		font-size: 40rpx;
		text-align: center;
		color: #fff;
		margin: 10rpx auto 30rpx;
		font-weight: bold;
	}

	/deep/ .uni-forms {
		min-height: 66vh;
		overflow: auto;
	}

	/deep/.uni-icons {
		padding: 25rpx;
		margin-right: -5rpx;
	}

	/deep/ .biaodanBox {
		background: linear-gradient(-28deg, #c2d679, #87ae3b, 70%, #87ae3b);
		;
		position: relative;
		color: #fff !important;
		/* background-image: url(); */
	}

	.imgapi {
		width: 750rpx;
		height: 100vh;
	}

	/deep/ .uni-forms-item__label .label-text.data-v-39373d84 {
		color: #fff;
	}

	/deep/ .uni-forms-item__inner.data-v-39373d84 {
		/* display: flex; */
		padding-bottom: 10rpx;
	}

	.martop {
		margin-top: 19rpx;
		color: #fff;
	}

	.btnsubmitForm {
		background-color: #fff;
		color: #1AAD19;
		width: 700rpx;
		margin: 40rpx 0;
	}

	.desc {
		margin-top: 50rpx;
		font-size: 30rpx;
		color: #fff;
		text-align: center;
		font-weight: 600;
	}
</style>
